import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';
import 'package:yi_shop/model/message.dart';
import 'package:yi_shop/ui/scroll_refresh_config.dart';
import 'package:yi_shop/utils/colors.dart';
import 'package:yi_shop/utils/styles.dart';
import 'package:yi_shop/utils/svg.dart';
import 'package:yi_shop/utils/tools.dart';

class MessageInteractController extends GetxController {
  RxList<MessageInteractModel> pageList = RxList([]);

  RefreshController refreshController = RefreshController();

  @override
  void onInit() {
    pageList.add(MessageInteractModel(
        title: '向你求助', date: '19/5/14', remark: '衣服透气性好吗', nickname: '1****P', from: '来自问大家'));
    pageList.add(MessageInteractModel(
        title: '向你求助', date: '19/5/14', remark: '衣服透气性好吗？', nickname: '漂**亮', from: '来自问大家'));
    pageList.add(MessageInteractModel(
        title: '向你求助', date: '19/5/14', remark: '您这衣服是假扣吗？', from: '来自问大家', nickname: 't**6'));
    pageList.add(MessageInteractModel(
        title: '向你求助', date: '19/5/14', remark: '求问 含激素吗？', from: '来自问大家', nickname: 'z**6'));
    pageList.add(MessageInteractModel(
        title: '向你求助', date: '19/5/14', remark: '是什么布料？', from: '来自问大家', nickname: 't**7'));
    pageList.add(MessageInteractModel(
        title: '优酷会员权益到账提醒',
        date: '19/5/14',
        remark: '你好请问这款质量怎么样，实木的吗，结实吗？',
        from: '来自问大家',
        nickname: 't**9'));
    super.onInit();
  }

  Future<void> onRefresh() async {
    /// 发起请求
    await Future.delayed(const Duration(milliseconds: 2000));
    refreshController.refreshCompleted(resetFooterState: true);
  }

  Future<void> onLoading() async {
    /// 发起请求
    await Future.delayed(const Duration(milliseconds: 2000));

    /// if failed, use loadFailed(), if no data return, use LoadNodata()
    if (pageList.length > 35) {
      return refreshController.loadNoData();
    }

    /// 添加数据
    initData();

    /// 完毕
    refreshController.loadComplete();
  }

  void initData() {
    for (var i = 0; i < 10; i++) {
      pageList.add(MessageInteractModel(
          title: '向你求助', date: '19/5/14', remark: '求问 含激素吗？', from: '来自社群', nickname: 't***3'));
    }
  }
}

class MessageInteractPage extends GetView<MessageInteractController> {
  const MessageInteractPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: ToolsUtils.builderLeading(),
        title: Text(
          '互动消息',
          style: StylesUtils.customTextStyle(
              fontSize: StylesUtils.fontSize18, fontWeight: FontWeight.w700),
        ),
      ),
      body: Obx(() => scrollRefreshConfig(context)),
    );
  }

  ScrollRefreshConfig scrollRefreshConfig(BuildContext context) {
    return ScrollRefreshConfig(
      refreshController: controller.refreshController,
      onRefresh: controller.onRefresh,
      onLoading: controller.onLoading,
      child: listViewBuilder(context),
    );
  }

  ListView listViewBuilder(BuildContext context) {
    return ListView.builder(
      itemBuilder: (_, int index) {
        var row = controller.pageList[index];
        return Container(
          margin: const EdgeInsets.only(top: 15),
          alignment: Alignment.center,
          child: Container(
            width: 345,
            padding: EdgeInsets.all(12.w),
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(5.r),
            ),
            child: Column(
              children: [
                Container(
                  alignment: Alignment.centerLeft,
                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: [
                      Expanded(
                        child: Text.rich(TextSpan(children: [
                          WidgetSpan(
                            alignment: PlaceholderAlignment.middle,
                            child: SvgUtils.assetName('u12400', width: 20, height: 20),
                          ),
                          TextSpan(
                            text: '  ${row.nickname}  ${row.title}',
                            style: StylesUtils.customTextStyle(
                                fontWeight: FontWeight.w500, color: ColorsUtils.color3333),
                          )
                        ])),
                      ),
                      Text(
                        row.date,
                        style: StylesUtils.customTextStyle(color: ColorsUtils.color9999),
                      )
                    ],
                  ),
                ),
                Container(
                  margin: const EdgeInsets.only(top: 10),
                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: [
                      Container(
                        width: 70,
                        height: 70,
                        alignment: Alignment.center,
                        decoration: BoxDecoration(
                          color: ColorsUtils.parseColorFromHexString(ColorsUtils.colorFbb8),
                          borderRadius: BorderRadius.circular(5.r),
                        ),
                        child: SvgUtils.assetName('u962', width: 30, height: 22),
                      ),
                      Expanded(
                          child: Container(
                              padding: const EdgeInsets.only(left: 10),
                              child: Column(
                                children: [
                                  Container(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      row.remark,
                                      style: StylesUtils.customTextStyle(
                                          color: ColorsUtils.color6666,
                                          fontSize: StylesUtils.fontSize13,
                                          lineHeight: 1.35.h),
                                    ),
                                  ),
                                  Container(
                                    margin: const EdgeInsets.only(top: 10),
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      row.from,
                                      style: StylesUtils.customTextStyle(
                                          color: ColorsUtils.color9999,
                                          fontSize: StylesUtils.fontSize13,
                                          lineHeight: 1.35.h),
                                    ),
                                  ),
                                ],
                              )))
                    ],
                  ),
                )
              ],
            ),
          ),
        );
      },
      itemCount: controller.pageList.length,
    );
  }
}
